<template>
	<view class="count poRel">
		<view class="poFix wid100" style="top: 0;z-index: 11;background-color: #e9ffe4;">
			<!-- 状态栏高度 -->
			<view :style="{ height: `${statusBarHeight}px` }"></view>
			<!-- 自定义导航栏高度 并 居中 -->
			<view class="dis disAl disJuC poRel" :style="{height: `${barHeight}px`}">
				<view class="poAbs" style="width: 32rpx;height: 32rpx;left: 22rpx;" @click="fanhui()">
					<image src="../../../static/fanhui.png" class="wh100"></image>
				</view>
				<view class="foSi35" style="line-height: 36rpx;">分销合伙人申请</view>
			</view>
		</view>
		<view :style="{ height: `${statusBarHeight+barHeight}px` }"></view>
		<view class="poRel" :style="{ height: `calc(100vh - ${statusBarHeight+barHeight}px);` }" style="z-index: 2;">
			<view class="wid100" style="height: 338rpx;">
				<image :src="urlImage+'/wechatimg/hhr.png'" class="wh100"></image>
			</view>
			<view class="wid90 mar borRad30 mar-top30" style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.2);">
				<view style="height: 40rpx;"></view>
				<view class="wid90 mar">
					<view class="dis disAl">
						<view class="fowe800 foSi35" style="text-align: right;width: 28%;">
							<text style="color: #FE0000;">*</text>
							<text>姓名：</text>
						</view>
						<input class="hei86 textCen foSi30 fowe600" style="width: 72%;border-bottom: 1px solid #A6A6A6;" 
							v-model="name" placeholder="请输入真实姓名"/>
					</view>
					<view class="dis disAl mar-top30">
						<view class="fowe800 foSi35" style="text-align: right;width: 28%;">
							<text style="color: #FE0000;">*</text>
							<text>手机号：</text>
						</view>
						<input class="hei86 textCen foSi30 fowe600" style="width: 72%;border-bottom: 1px solid #A6A6A6;" 
							v-model="phone" type="tel" placeholder="请输入手机号码"/>
					</view>
					<view class="dis disAl mar-top30">
						<view class="fowe800 foSi35" style="text-align: right;width: 28%;">邀请码：</view>
						<input class="hei86 textCen foSi30 fowe600" style="width: 72%;border-bottom: 1px solid #A6A6A6;" 
							v-model="code" placeholder="请输入邀请码"/>
					</view>
				</view>
				<view style="height: 60rpx;"></view>
			</view>
			<view class="wid100 poAbs " style="bottom: 50rpx;">
				<view class="wid90 mar borRad40 hei80 dis disAl disJuC foSi35 coFFF fowe600" @click="tijiao()"
					style="background-color: #F94B4A;">提交</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	import {
		utilMixins
	} from "@/common/util-mixins.js"
	import {
		getDw
	} from "@/common/wechat-util"
	import utils from '@/common/utils'
	export default {
		name: 'share',
		data() {
			return {
				statusBarHeight: 0,
				barHeight: 0,
				name: '',
				phone: '',
				code: ''
			}
		},
		async onLoad() {
			// 状态栏高度
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			// 胶囊数据
			const {
				top,
				height
			} = wx.getMenuButtonBoundingClientRect();
			// 自定义导航栏高度 = 胶囊高度 + 胶囊的padding*2, 如果获取不到设置为38
			this.barHeight = height ? height + (top - this.statusBarHeight) * 2 : 38;
			this.getList()
		},
		methods: {
			tijiao() {
				if(!this.name){
					return this.util.message(`请输入真实姓名`,3,3000)
				}
				if(!this.phone){
					return this.util.message(`请输入手机号码`,3,3000)
				}
			},
			async getList() {
				let {
					data
				} = await this.util.request({
					'url': this.api.hydj,
					data: {
						userId: uni.getStorageSync('userId')
					}
				})
				this.list = data
				console.log(data)
			},
			fanhui() {
				uni.navigateBack(1)
			},
		}
	}
</script>

<style scoped lang="scss">
	.count {
		min-height: 100vh;
		background-color: #F6F6F6;
	}
</style>